<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <base data-ice="baseUrl" href="../../">
  <title data-ice="title">src/index.js | live2d-widget.js</title>
  <link type="text/css" rel="stylesheet" href="css/style.css">
  <link type="text/css" rel="stylesheet" href="css/prettify-tomorrow.css">
  <script src="script/prettify/prettify.js"></script>
  <script src="script/manual.js"></script>
<meta name="description" content="Add the Sseexxyyy live2d to webpages."><meta property="twitter:card" content="summary"><meta property="twitter:title" content="live2d-widget.js"><meta property="twitter:description" content="Add the Sseexxyyy live2d to webpages."></head>
<body class="layout-container" data-ice="rootContainer">

<header>
  <a href="./">Home</a>
  
  <a href="identifiers.html">Reference</a>
  <a href="source.html">Source</a>
  
  <div class="search-box">
  <span>
    <img src="./image/search.png">
    <span class="search-input-edge"></span><input class="search-input"><span class="search-input-edge"></span>
  </span>
    <ul class="search-result"></ul>
  </div>
<a style="position:relative; top:3px;" href="https://github.com/xiazeyu/live2d-widget.js"><img width="20px" src="./image/github.png"></a></header>

<nav class="navigation" data-ice="nav"><div>
  <ul>
    
  <li data-ice="doc"><span data-ice="kind" class="kind-class">C</span><span data-ice="name"><span><a href="class/src/index.js~L2Dwidget.html">L2Dwidget</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-function">F</span><span data-ice="name"><span><a href="function/index.html#static-function-PlatformManager">PlatformManager</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-function">F</span><span data-ice="name"><span><a href="function/index.html#static-function-captureFrame">captureFrame</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-function">F</span><span data-ice="name"><span><a href="function/index.html#static-function-theRealInit">theRealInit</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-function">F</span><span data-ice="name"><span><a href="function/index.html#static-function-cManager">cManager</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-function">F</span><span data-ice="name"><span><a href="function/index.html#static-function-cModel">cModel</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-function">F</span><span data-ice="name"><span><a href="function/index.html#static-function-createElement">createElement</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-function">F</span><span data-ice="name"><span><a href="function/index.html#static-function-getCurrentPath">getCurrentPath</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-variable">V</span><span data-ice="name"><span><a href="variable/index.html#static-variable-cDefine">cDefine</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-variable">V</span><span data-ice="name"><span><a href="variable/index.html#static-variable-currWebGL">currWebGL</a></span></span></li>
<li data-ice="doc"><a data-ice="dirPath" class="nav-dir-path" href="identifiers.html#config">config</a><span data-ice="kind" class="kind-function">F</span><span data-ice="name"><span><a href="function/index.html#static-function-configApplyer">configApplyer</a></span></span></li>
<li data-ice="doc"><a data-ice="dirPath" class="nav-dir-path" href="identifiers.html#lib">lib</a><span data-ice="kind" class="kind-function">F</span><span data-ice="name"><span><a href="function/index.html#static-function-EYE_STATE">EYE_STATE</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-function">F</span><span data-ice="name"><span><a href="function/index.html#static-function-L2DBaseModel">L2DBaseModel</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-function">F</span><span data-ice="name"><span><a href="function/index.html#static-function-L2DExpressionMotion">L2DExpressionMotion</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-function">F</span><span data-ice="name"><span><a href="function/index.html#static-function-L2DExpressionParam">L2DExpressionParam</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-function">F</span><span data-ice="name"><span><a href="function/index.html#static-function-L2DEyeBlink">L2DEyeBlink</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-function">F</span><span data-ice="name"><span><a href="function/index.html#static-function-L2DMatrix44">L2DMatrix44</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-function">F</span><span data-ice="name"><span><a href="function/index.html#static-function-L2DModelMatrix">L2DModelMatrix</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-function">F</span><span data-ice="name"><span><a href="function/index.html#static-function-L2DMotionManager">L2DMotionManager</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-function">F</span><span data-ice="name"><span><a href="function/index.html#static-function-L2DPartsParam">L2DPartsParam</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-function">F</span><span data-ice="name"><span><a href="function/index.html#static-function-L2DPhysics">L2DPhysics</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-function">F</span><span data-ice="name"><span><a href="function/index.html#static-function-L2DPose">L2DPose</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-function">F</span><span data-ice="name"><span><a href="function/index.html#static-function-L2DTargetPoint">L2DTargetPoint</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-function">F</span><span data-ice="name"><span><a href="function/index.html#static-function-L2DViewMatrix">L2DViewMatrix</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-function">F</span><span data-ice="name"><span><a href="function/index.html#static-function-Live2DFramework">Live2DFramework</a></span></span></li>
<li data-ice="doc"><a data-ice="dirPath" class="nav-dir-path" href="identifiers.html#utils">utils</a><span data-ice="kind" class="kind-function">F</span><span data-ice="name"><span><a href="function/index.html#static-function-MatrixStack">MatrixStack</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-function">F</span><span data-ice="name"><span><a href="function/index.html#static-function-ModelSettingJson">ModelSettingJson</a></span></span></li>
</ul>
</div>
</nav>

<div class="content" data-ice="content"><h1 data-ice="title">src/index.js</h1>
<pre class="source-code line-number raw-source-code"><code class="prettyprint linenums" data-ice="content">// Created by xiazeyu.

////////////////////////////////////
// Celebrate for the 3.0 version! //
////////////////////////////////////

/**
 * @description The entry point of live2d-widget.
 */


&apos;use strict&apos;;

import device from &apos;current-device&apos;;
import { config, configApplyer }from &apos;./config/configMgr&apos;;
import live2dWidgetDialog from &apos;./dialog&apos;;

if (process.env.NODE_ENV === &apos;development&apos;){
  console.log(&apos;--- --- --- --- ---\nLive2Dwidget: Hey that, notice that you are now in DEV MODE.\n--- --- --- --- ---&apos;);
}

let coreApp;
/**
 * The main entry point, which is ... nothing
 */

class L2Dwidget {

  constructor() {
    this.eventHandlers = {};
    this.config = config;
  }

  on(name, handler) {
    if (typeof handler !== &apos;function&apos;) {
      throw new TypeError(&apos;Event handler is not a function.&apos;);
    }
    if (!this.eventHandlers[name]) {
      this.eventHandlers[name] = [];
    }
    this.eventHandlers[name].push(handler);
    return this;
  }

  emit(name, ...args) {
    if (!!this.eventHandlers[name]) {
      this.eventHandlers[name].forEach(handler =&gt; {
        if (typeof handler === &apos;function&apos;) {
          handler(...args);
        }
      });
    }
    if (!!this.eventHandlers[&apos;*&apos;]) {
      this.eventHandlers[&apos;*&apos;].forEach(handler =&gt; {
        if (typeof handler === &apos;function&apos;) {
          handler(name, ...args);
        }
      });
    }
    return this;
  }

/**
 * The init function
 * @param {Object}   [userConfig] User&apos;s custom config &#x7528;&#x6237;&#x81EA;&#x5B9A;&#x4E49;&#x8BBE;&#x7F6E;
 * @param {String}   [userConfig.model.jsonPath = &apos;&apos;] Path to Live2D model&apos;s main json eg. `https://test.com/miku.model.json` model&#x4E3B;&#x6587;&#x4EF6;&#x8DEF;&#x5F84;
 * @param {Number}   [userConfig.model.scale = 1] Scale between the model and the canvas &#x6A21;&#x578B;&#x4E0E;canvas&#x7684;&#x7F29;&#x653E;
 * @param {Number}   [userConfig.display.superSample = 2] rate for super sampling rate &#x8D85;&#x91C7;&#x6837;&#x7B49;&#x7EA7;
 * @param {Number}   [userConfig.display.width = 150] Width to the canvas which shows the model canvas&#x7684;&#x957F;&#x5EA6;
 * @param {Number}   [userConfig.display.height = 300] Height to the canvas which shows the model canvas&#x7684;&#x9AD8;&#x5EA6;
 * @param {String}   [userConfig.display.position = &apos;right&apos;] Left of right side to show &#x663E;&#x793A;&#x4F4D;&#x7F6E;&#xFF1A;&#x5DE6;&#x6216;&#x53F3;
 * @param {Number}   [userConfig.display.hOffset = 0] Horizontal offset of the canvas canvas&#x6C34;&#x5E73;&#x504F;&#x79FB;
 * @param {Number}   [userConfig.display.vOffset = -20] Vertical offset of the canvas canvas&#x5782;&#x76F4;&#x504F;&#x79FB;
 * @param {Boolean}  [userConfig.mobile.show = true] Whether to show on mobile device &#x662F;&#x5426;&#x5728;&#x79FB;&#x52A8;&#x8BBE;&#x5907;&#x4E0A;&#x663E;&#x793A;
 * @param {Number}   [userConfig.mobile.scale = 0.5] Scale on mobile device &#x79FB;&#x52A8;&#x8BBE;&#x5907;&#x4E0A;&#x7684;&#x7F29;&#x653E;
 * @param {String}   [userConfig.name.canvas = &apos;live2dcanvas&apos;] ID name of the canvas canvas&#x5143;&#x7D20;&#x7684;ID
 * @param {String}   [userConfig.name.div = &apos;live2d-widget&apos;] ID name of the div div&#x5143;&#x7D20;&#x7684;ID
 * @param {Number}   [userConfig.react.opacity = 0.7] opacity &#x900F;&#x660E;&#x5EA6;
 * @param {Boolean}  [userConfig.dev.border = false] Whether to show border around the canvas &#x5728;canvas&#x5468;&#x56F4;&#x663E;&#x793A;&#x8FB9;&#x754C;
 * @param {Boolean}  [userConfig.dialog.enable = false] Display dialog &#x663E;&#x793A;&#x4EBA;&#x7269;&#x5BF9;&#x8BDD;&#x6846;
 * @param {Boolean}  [userConfig.dialog.hitokoto = false] Enable hitokoto &#x4F7F;&#x7528;&#x4E00;&#x8A00;API
 * @return {null}
 */

  init(userConfig = {}){
    configApplyer(userConfig);
    this.emit(&apos;config&apos;, this.config);
    if((!config.mobile.show)&amp;&amp;(device.mobile())){
      return;
    }
    import(/* webpackMode: &apos;lazy&apos; */ &apos;./cLive2DApp&apos;).then(f =&gt; {
      coreApp = f;
      coreApp.theRealInit(this);
    }).catch(err =&gt; {
      console.error(err);
    });
  }


/**
 * Capture current frame to png file {@link captureFrame}
 * @param  {Function} callback The callback function which will receive the current frame
 * @return {null}
 */

  captureFrame(callback){
    return coreApp.captureFrame(callback);
  }

/**
 * download current frame {@link L2Dwidget.captureFrame}
 * @return {null}
 */

  downloadFrame(){
    this.captureFrame(
      function(e){
        let link = document.createElement(&apos;a&apos;);
        document.body.appendChild(link);
        link.setAttribute(&apos;type&apos;, &apos;hidden&apos;);
        link.href = e;
        link.download = &apos;live2d.png&apos;;
        link.click();
      }
    );
  }

};

let _ = new L2Dwidget();

export {
  _ as L2Dwidget,
}
</code></pre>

</div>

<footer class="footer">
  Generated by <a href="https://esdoc.org">ESDoc<span data-ice="esdocVersion">(1.1.0)</span><img src="./image/esdoc-logo-mini-black.png"></a>
</footer>

<script src="script/search_index.js"></script>
<script src="script/search.js"></script>
<script src="script/pretty-print.js"></script>
<script src="script/inherited-summary.js"></script>
<script src="script/test-summary.js"></script>
<script src="script/inner-link.js"></script>
<script src="script/patch-for-local.js"></script>
</body>
</html>
